<template>
  <div style="padding: 0 20px;">
    <el-row>
      <el-col :span="24">
        <el-card>
          <div
            slot="header"
            class="clearfix"
            style="text-align:center"
          >
            <span>健康信息上报</span>
          </div>
          <el-table
            :data="tableData"
            border
            style="width: 100%;"
          >
            <el-table-column
              align='center'
              prop="u_id"
              label="学号"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="username"
              label="姓名"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="departments"
              label="专业"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="classes"
              label="班级"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="address"
              label="生源地"
            >
            </el-table-column>
          </el-table>
        </el-card>
        <el-divider></el-divider>

        <el-card v-if="show==false">
          <div
            slot="header"
            style="text-align: center"
          >
            <span>今日检测情况</span>
          </div>
          <el-alert
            title="今日申请表提交成功"
            type="success"
            center
            show-icon
          >
          </el-alert>
          <el-table
            :data="tableData_n"
            border
            style="width: 100%"
          >
            <el-table-column
              align='center'
              prop="temperature"
              label="当前体温"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="hot"
              label="是否有发热症状"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="mask"
              label="口罩是否充足"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="leaveout"
              label="是否离开学校"
            >
            </el-table-column>
            <el-table-column
              align='center'
              prop="todanger"
              label="是否去过高危地区"
            >
            </el-table-column>
          </el-table>

        </el-card>

        <el-card v-else-if="show==true">
          <el-form
            ref="form"
            :model="form"
            label-width="150px"
          >
            <el-form-item label="当前体温">
              <el-input
                v-model="form.temp"
                style="width:130px"
                maxlength="4"
                oninput="value=value.replace(/[^\d.]/g,'')"
              ></el-input>
            </el-form-item>
            <el-form-item label="是否有发热症状">
              <el-radio-group v-model="form.radio1">
                <el-radio label="否"></el-radio>
                <el-radio label="是"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="口罩是否充足">
              <el-radio-group v-model="form.radio2">
                <el-radio label="否"></el-radio>
                <el-radio label="是"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="是否离开学校">
              <el-radio-group v-model="form.radio3">
                <el-radio label="否"></el-radio>
                <el-radio label="是"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item label="是否去过高危地区">
              <el-radio-group v-model="form.radio4">
                <el-radio label="否"></el-radio>
                <el-radio label="是"></el-radio>
              </el-radio-group>
            </el-form-item>
            <el-form-item>
              <el-button
                type="primary"
                @click="openDialog"
              >提交</el-button>
            </el-form-item>
          </el-form>
        </el-card>

      </el-col>
    </el-row>
  </div>
</template>

<script>
import { getInfo } from "../../api/user";
import {
  getHealthNowDayByid,
  sethealth,
} from "../../api/student-api/healthTable";

export default {
  name: "healthTable",
  data() {
    return {
      show: true,
      tableData: [],
      tableData_n: null,
      username: "",
      form: {
        temp: "",
        radio1: "",
        radio2: "",
        radio3: "",
        radio4: "",
      },
    };
  },
  created() {
    // 获取当前用户信息
    getInfo().then((res) => {
      this.tableData.push(res.data);
    });

    // 调用获取当天某用户报表并且决定是否允许填写
    this.getnowdatahealth();
  },
  methods: {
    // 获取当天某用户报表并且查出是否允许填写
    getnowdatahealth() {
      getHealthNowDayByid().then((res) => {
        if (res.data.data.length == 0) this.show = true;
        else {
          this.show = false;
          this.tableData_n = res.data.data;
        }
      });
    },
    // 提交填写
    onSubmit() {
      if (
        !this.form.temp ||
        !this.form.radio1 ||
        !this.form.radio2 ||
        !this.form.radio3 ||
        !this.form.radio4
      )
        this.open3("填报表不可留空");
      else {
        let reg = /((3[5-9])|40).\d/;
        let tempBool = reg.test(this.form.temp);
        if (!tempBool) this.open3("体温请输入35.0°C至40.9°C区间");
        else {
          sethealth(
            this.form.temp,
            this.form.radio1,
            this.form.radio2,
            this.form.radio3,
            this.form.radio4
          ).then((res) => {
            this.$message({
              type: "success",
              message: "提交成功",
            });
            if (res.length != 0) {
              this.getnowdatahealth();
            }
          });
        }
      }
    },
    /**
     * 提交弹窗
     */
    openDialog() {
      this.$confirm("提交健康报表, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.onSubmit();
        })
        .catch(() => {
          this.$message({
            type: "info",
            message: "已取消提交",
          });
        });
    },
    open3(v) {
      this.$message({
        message: v,
        type: "warning",
      });
    },
  },
};
</script>

<style scoped lang="scss">
</style>
